.nav-visible{
  .read-man{
    display:none;
  }
}

.dockbar {
  .transition(z-index 4s ease 0s);
  display: block;
  width: 100%;
  .box-sizing(border-box);
  padding: 0;
  margin: 0;
  overflow: visible;
  font-family: @font-family-demo;
  &.navbar-fixed-top{
    @media (max-width: 1200px) {
      position:fixed;
      .container{
        width:auto;
      }
    }
  }
  .menu-btn{
    display:none;
    @media (max-width: 1200px) {
      display: inline-block;
      float: right;
      position: relative;
      .box-sizing(border-box);
      width:66px;
      height: 66px;
      background: none #1b1f23;
      border: 0 none;
      border-left: 1px solid #272b2f;
      color: #919497;
      &:hover, &:focus{
        border: 0 none;
        border-left: 1px solid #272b2f;
        color: #ffffff;
      }
      span{
        content: '';
        background-image: url("@{startup-basePath}common-files/icons/menu-icon.png");
        width: 17px;
        height: 12px;
        &:before{
          content: '';
        }
      }
    }
  }
  .main-menu {
    display: block;
    overflow: hidden;
    background-color: #1b1f23;
    margin: 0;
    .box-sizing(border-box);
    width: 100%;
    padding: 0;
    > div {
      height: 65px;
      > div {
        height: 65px;
      }
    }
    a.man-brand {
      display: inline-block;
      float:left;
      text-decoration: none;
      .line-height(65px);

      @media (max-width: 1200px) {
        .line-height(65px);
        width: auto;

      }
      .logotype {
        .font(16px, white);
        font-weight: 800;
        text-transform: uppercase;
      }
      .doc-title {
        text-transform: uppercase;
        .font(16px, #919497);
        font-weight: normal;
      }
    }

    dl {
      display: inline-block;
      margin: 0;
      @media (max-width: 1200px) {
        display:none;

      }

      dd {
        margin: 0;
        padding:17px 0;
        .line-height(31px);
        display: inline-block;

        a {
          .font(12px, #919497);
          font-family: @font-family-demo;
          font-weight: 500;
          padding-right:22px;
          text-transform: uppercase;
          text-decoration: underline;
          .a-color(#919497, white);
          display:block;


          &.active {
            text-decoration: none;
            color: white;
          }
        }
      }
    }
  }
}

body{
  padding-top: 66px;
  position:relative;
  font-family:@font-family-demo;
  &.hovered{
    background-color: @clouds;
  }
  .delimiter-big{
    margin-top: 180px;
  }
  .delimiter{
    margin-top: 30px;
  }
  section[class*=content-]{
    margin-top: 0; margin-bottom: 0;
  }
  .colapsed-menu{
    display: none;
    width: 230px;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    padding: 25px 0;
    margin: 0;
    overflow: auto;
    background-color: #222527;
    dl{
      position:relative;
      display:block;
      margin:0;
      dd{
        border-bottom:1px solid #24292D;
        .line-height(45px);
        margin:0;
        .box-sizing('border-box');
        width:100%;
        text-transform:uppercase;
        dd{
          padding:0 0 0 20px;
          font-size:12px;
          border-top:1px solid #24292D;
          border-bottom:0;
          line-height: 30px;
        }
        > a{
          display:block;
          padding:0 0 0 35px;
          .a-color(#5B5E61, white);
          &.active{
            text-decoration:none;
            color:white;
            &:after{
              display:none;
            }
          }
        }
      }
    }
    &.show-menu {
      display: block;
    }
    &::-webkit-scrollbar {
      display: none;
    }
  }
}